<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=contain">
		<meta name="format-detection" content="telphone=no" />
		<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/my.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/better_scroll.min.js" type="text/javascript" charset="utf-8"></script>

		<link rel="stylesheet" type="text/css" href="css/base.css" />
		<link rel="stylesheet" type="text/css" href="css/json.css" />
	</head>
	<body>
		
		<div id="urban">
			<input
				id="input"
				type="text" 
				readonly="readonly" 
				class="areas"
				placeholder="选择省市区111" 
				style="border: 1px solid rgba(210,210,210,0.8);
					width: 80%;
					margin: 0.3rem auto;
					padding: 0.15rem 0.3rem;
					border-radius: 0.2rem;
				"
			/>
		</div>
		
		<div id="urban1">
			<input
				id="input1"
				type="text" 
				readonly="readonly" 
				class="areas"
				placeholder="选择省市区222" 
				style="border: 1px solid rgba(210,210,210,0.8);
					width: 80%;
					margin: 0.3rem auto;
					padding: 0.15rem 0.3rem;
					border-radius: 0.2rem;
				"
			/>
		</div>
		
		<div id="urban2">
			<input
				type="text" 
				readonly="readonly" 
				id="input2"
				class="areas"
				placeholder="选择省市区333" 
				style="border: 1px solid rgba(210,210,210,0.8);
					width: 80%;
					margin: 0.3rem auto;
					padding: 0.15rem 0.3rem;
					border-radius: 0.2rem;
				"
			/>
		</div>

		<script src="./js/city-picker.data.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/prototype.js" type="text/javascript" charset="utf-8"></script>
		
		<script type="text/javascript">
			var num1 = new Star({
				id:"input",//input的ID
				dataId:"urban",//父级id
				wheels:["四川省", "泸州市", "合江县"],//默认数据
				callback:function(data){
					console.log(data)
					$("#urban input").val(data.province+"-"+data.city+"-"+data.area)
				}
			})
			var num2 = new Star({
				id:"input1",//input的ID
				dataId:"urban1",//父级id
				wheels:["西藏自治区"],//默认数据
				callback:function(data){
					console.log(data)
					$("#urban1 input").val(data.province+"-"+data.city+"-"+data.area)
				}
			})
			var num2 = new Star({
				id:"input2",//input的ID
				dataId:"urban2",//父级id
				wheels:["天津市", "天津市", "南开区"],//默认数据
				callback:function(data){
					console.log(data)
					$("#urban2 input").val(data.province+"-"+data.city+"-"+data.area)
				}
			})
		</script>
	</body>
</html>
